<template>
<el-pagination background layout="total, sizes, prev, pager, next, jumper" :total="total"
                    @size-change="sizeChange" @current-change="currentChange" v-model:current-page="limit"
                    v-model:page-size="size" :page-sizes="[10, 20, 50, 100]" />
</template>

<script lang='ts' setup>
interface PaginationProps {
    size:number,
    total:number,
    limit:number
}
defineProps<PaginationProps>()

interface PaginationEmits {
    (e: 'sizeChange', size: number): void
    (e: 'currentChange', current: number): void
}
const emit = defineEmits<PaginationEmits>()
const sizeChange = (val:number) => {
    emit("sizeChange",val)
}
const currentChange = (val:number) =>{
    emit("currentChange",val)
}
</script>

<style scoped>

</style>